<template>
	<div class="action-sheet-container">
		<van-action-sheet v-model:show="show" :actions="props.actions" style="height: 250px; overflow-y: auto" @select="onSelect">
			<template v-for="(_, name) in $slots" #[name]>
				<slot :name="name"></slot>
			</template>
		</van-action-sheet>
	</div>
</template>
<script setup>
const show = ref(false);
const props = defineProps({
	actions: { type: Array, default: () => [] },
});
const emit = defineEmits(['select']);
const onSelect = (item) => {
	emit('select', item);
};
const handleClose = () => {
	show.value = false; //
};
const handleOn = () => {
	show.value = true; //
};
defineExpose({ handleClose, handleOn });
</script>
<style lang="scss" scoped>
:deep(.van-action-sheet__description) {
	padding: 0 20px !important;
}
</style>
